﻿<?xml version="1.0" encoding="utf-8"?><Articles><Article><ArticlesID>822</ArticlesID><Title>Tạo box lấy th&amp;#244;ng tin thời tiết đơn giản từ VnExpress</Title><Body>&amp;lt;p&amp;gt;Trong &amp;lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;http://dev.meotom.net/2010/3/5/Tao-box-doc-tin-RSS-don-gian-voi-Javascript-32C.htm&amp;quot;&amp;gt;b&amp;amp;agrave;i trước&amp;lt;/a&amp;gt; ch&amp;amp;uacute;ng ta đ&amp;amp;atilde; biết c&amp;amp;aacute;ch sử dụng &amp;lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;http://blog.meotom.net/Library/AjaxRequest.js&amp;quot;&amp;gt;&amp;lt;em&amp;gt;AjaxRequest &amp;lt;/em&amp;gt;&amp;lt;/a&amp;gt;để lấy RSS&amp;amp;nbsp;từ bất kỳ trang n&amp;amp;agrave;o&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;trong b&amp;amp;agrave;i n&amp;amp;agrave;y m&amp;amp;igrave;nh xin giới thiệu c&amp;amp;aacute;ch lấy th&amp;amp;ocirc;ng tin thời tiết cực kỳ đơn giản từ &amp;lt;em&amp;gt;VnExpress&amp;lt;/em&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;Độ kh&amp;amp;oacute;:&amp;amp;nbsp;B&amp;amp;igrave;nh thường |&amp;amp;nbsp;Thời gian thực hiện: 30 đến 45p&amp;lt;/p&amp;gt;
&amp;lt;p style=&amp;quot;text-align: center;&amp;quot;&amp;gt;&amp;lt;img width=&amp;quot;200&amp;quot; height=&amp;quot;153&amp;quot; alt=&amp;quot;&amp;quot; src=&amp;quot;http://dev.meotom.net/Uploads/admin/2010/3/8/tao-box-lay-thong-tin-thoi-tiet-vnexpress.gif&amp;quot; /&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;Ưu điểm:&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;1. Th&amp;amp;ocirc;ng tin được cập nhật thường xuy&amp;amp;ecirc;n (th&amp;amp;ocirc;ng qua &amp;lt;em&amp;gt;VnExpress&amp;lt;/em&amp;gt;)&amp;lt;br /&amp;gt;
2. Nhanh gọn (do sử dụng JavaScript)&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;Nhược điểm:&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;1. Th&amp;amp;ocirc;ng tin phải phụ thuộc v&amp;amp;agrave;o site kh&amp;amp;aacute;c (&amp;lt;em&amp;gt;VnExpress&amp;lt;/em&amp;gt;)&amp;lt;br /&amp;gt;
2. Kh&amp;amp;ocirc;ng chạy được khi người d&amp;amp;ugrave;ng Disable Javascript tại Browser&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;Bước l&amp;amp;agrave;m:&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;1. khởi tạo 1 function &amp;lt;em&amp;gt;getWeather() &amp;lt;/em&amp;gt;sử dụng &amp;lt;/strong&amp;gt;&amp;lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;http://blog.meotom.net/Library/AjaxRequest.js&amp;quot;&amp;gt;&amp;lt;em&amp;gt;&amp;lt;strong&amp;gt;AjaxRequest&amp;lt;/strong&amp;gt;&amp;lt;/em&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: csharp;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
function getWeather(sCity) {
    AjaxRequest.get(
	{
	    &amp;amp;quot;url&amp;amp;quot;: &amp;amp;quot;/Services/AjaxProxy.asp?sUrl=http://vnexpress.net/ListFile/Weather/&amp;amp;quot; + sCity + &amp;amp;quot;.xml&amp;amp;quot;
	    , 'onLoading': function() {  }
		, 'onSuccess': function(req) {			
                if (navigator.appVersion.indexOf(&amp;amp;quot;MSIE&amp;amp;quot;) != -1) {
		     var doc = new ActiveXObject(&amp;amp;quot;MSXML2.DOMDocument&amp;amp;quot;); 
		     doc.loadXML(req.responseText);				
		} else {
		     var doc = req.responseXML;
		}
	        var Item = doc.getElementsByTagName('Item');
	        var AdImg = &amp;amp;quot;&amp;amp;quot;, AdImg1 = &amp;amp;quot;&amp;amp;quot;, AdImg2 = &amp;amp;quot;&amp;amp;quot;, Weather = &amp;amp;quot;&amp;amp;quot;, strWrite = &amp;amp;quot;&amp;amp;quot;;

	        AdImg = getNodeValue(doc.getElementsByTagName('Item').item(0).getElementsByTagName('AdImg'));
	        AdImg1 = getNodeValue(doc.getElementsByTagName('Item').item(0).getElementsByTagName('AdImg1'));
	        AdImg2 = getNodeValue(doc.getElementsByTagName('Item').item(0).getElementsByTagName('AdImg2'));
	        Weather = getNodeValue(doc.getElementsByTagName('Item').item(0).getElementsByTagName('Weather'));


	        strWrite += &amp;amp;quot;&amp;amp;lt;img src='http://blog.meotom.net/images/Weather/&amp;amp;quot; + AdImg + &amp;amp;quot;' border='0' width='36' height='35' /&amp;amp;gt;&amp;amp;amp;nbsp;&amp;amp;quot;;
	        strWrite += &amp;amp;quot;&amp;amp;lt;img src='http://blog.meotom.net/images/Weather/&amp;amp;quot; + AdImg1 + &amp;amp;quot;' border='0' width='19' height='28' /&amp;amp;gt;&amp;amp;quot;;
	        strWrite += &amp;amp;quot;&amp;amp;lt;img src='http://blog.meotom.net/images/Weather/&amp;amp;quot; + AdImg2 + &amp;amp;quot;' border='0' width='19' height='28' /&amp;amp;gt;&amp;amp;quot;;
	        strWrite += &amp;amp;quot;&amp;amp;lt;img src='http://blog.meotom.net/images/Weather/c.gif' width='35' height='28' /&amp;amp;gt;&amp;amp;lt;br /&amp;amp;gt;&amp;amp;quot;;
	        strWrite += Weather;
	        gmobj(&amp;amp;quot;divWeather&amp;amp;quot;).innerHTML = strWrite;
		}
		, 'onError': function(req) {

		}
	});
}&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;H&amp;amp;agrave;m n&amp;amp;agrave;y nhận v&amp;amp;agrave;o chuỗi t&amp;amp;ecirc;n th&amp;amp;agrave;nh phố vd: SonLa, Hanoi, HCM&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;tương tự như &amp;lt;a href=&amp;quot;http://dev.meotom.net/2010/3/5/Tao-box-doc-tin-RSS-don-gian-voi-Javascript-32C.htm&amp;quot;&amp;gt;b&amp;amp;agrave;i trước&amp;lt;/a&amp;gt; b&amp;amp;agrave;i n&amp;amp;agrave;y ch&amp;amp;uacute;ng ta vẫn phải sử dụng 1 &amp;lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;http://dev.meotom.net/2010/1/4/HttpRequest-ASP-Classic-2BF.htm&amp;quot;&amp;gt;AjaxProxy&amp;lt;/a&amp;gt; để tr&amp;amp;aacute;nh &amp;lt;em&amp;gt;CrossDomain&amp;lt;/em&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;2. Ra ngo&amp;amp;agrave;i trang chủ ch&amp;amp;uacute;ng ta gọi h&amp;amp;agrave;m &amp;lt;em&amp;gt;getWeather &amp;lt;/em&amp;gt;trong sự kiện &amp;lt;em&amp;gt;onLoad &amp;lt;/em&amp;gt;(khởi tạo ban đầu khi trang được load)&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: csharp;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
            window.onload = function() {
                getWeather(&amp;amp;quot;Hanoi&amp;amp;quot;);
            }&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;3. Tiếp đ&amp;amp;oacute; viết một Select Box để người d&amp;amp;ugrave;ng chọn t&amp;amp;ecirc;n c&amp;amp;aacute;c th&amp;amp;agrave;nh phố&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: xhtml;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
        &amp;amp;lt;select name=&amp;amp;quot;cboListCity&amp;amp;quot; style=&amp;amp;quot;width:176px;&amp;amp;quot; onchange=&amp;amp;quot;javascript:getWeather(this.value);&amp;amp;quot;&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;SonLa&amp;amp;quot;&amp;amp;gt;Sơn La&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Haiphong&amp;amp;quot;&amp;amp;gt;Hải Ph&amp;amp;ograve;ng&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Hanoi&amp;amp;quot; selected=&amp;amp;quot;selected&amp;amp;quot;&amp;amp;gt;H&amp;amp;agrave; Nội&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Vinh&amp;amp;quot;&amp;amp;gt;Vinh&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Danang&amp;amp;quot;&amp;amp;gt;Đ&amp;amp;agrave; Nẵng&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Nhatrang&amp;amp;quot;&amp;amp;gt;Nha Trang&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Pleicu&amp;amp;quot;&amp;amp;gt;Pleiku&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;HCM&amp;amp;quot;&amp;amp;gt;Tp HCM&amp;amp;lt;/option&amp;amp;gt;
            &amp;amp;lt;option value=&amp;amp;quot;Viettri&amp;amp;quot;&amp;amp;gt;Việt Tr&amp;amp;igrave;&amp;amp;lt;/option&amp;amp;gt;
        &amp;amp;lt;/select&amp;amp;gt;&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;Ch&amp;amp;uacute;ng ta nhớ gọi sự ki&amp;amp;ecirc;n &amp;lt;em&amp;gt;&amp;lt;strong&amp;gt;onchange &amp;lt;/strong&amp;gt;&amp;lt;/em&amp;gt;trong Select Box (khi c&amp;amp;oacute; sự kiện chọn c&amp;amp;aacute;c Item trong Select Box sẽ&amp;amp;nbsp; gọi về h&amp;amp;agrave;m &amp;lt;strong&amp;gt;&amp;lt;em&amp;gt;getWeather &amp;lt;/em&amp;gt;&amp;lt;/strong&amp;gt;của ch&amp;amp;uacute;ng ta)&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;4. Viết tiếp 1 thẻ Div c&amp;amp;oacute; ID&amp;amp;nbsp;l&amp;amp;agrave; divWeather&amp;lt;/strong&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;pre class=&amp;quot;brush: xhtml;&amp;quot; title=&amp;quot;code&amp;quot;&amp;gt;
&amp;amp;lt;div id=&amp;amp;quot;divWeather&amp;amp;quot;&amp;amp;gt;&amp;amp;lt;/div&amp;amp;gt;&amp;lt;/pre&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;strong&amp;gt;5. Save and Run&amp;lt;/strong&amp;gt; &amp;lt;img alt=&amp;quot;&amp;quot; src=&amp;quot;http://dev.meotom.net/Library/Editor/fckeditor/editor/images/smiley/yahoo/4.gif&amp;quot; /&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;http://dev.meotom.net/Uploads/admin/2010/3/8/Weather.zip&amp;quot;&amp;gt;&amp;lt;span style=&amp;quot;font-size: medium;&amp;quot;&amp;gt;Download File Image&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;a name=&amp;quot;#DownloadSource&amp;quot; href=&amp;quot;http://demo.meotom.net/DemoWeather.zip&amp;quot;&amp;gt;&amp;lt;span style=&amp;quot;font-size: medium;&amp;quot;&amp;gt;Download Source&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;a href=&amp;quot;http://demo.meotom.net/Weather.htm&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;&amp;lt;span style=&amp;quot;font-size: medium;&amp;quot;&amp;gt;Demo Here&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;lt;span style=&amp;quot;font-size: large;&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&amp;lt;em&amp;gt;Enjoy&amp;lt;/em&amp;gt;&amp;lt;/strong&amp;gt;&amp;lt;/span&amp;gt;&amp;lt;/p&amp;gt;
&amp;lt;p&amp;gt;&amp;amp;nbsp;&amp;lt;/p&amp;gt;</Body><CommentEnabled>True</CommentEnabled><ViewCount>0</ViewCount><ReleaseDate>3/8/2010 3:41:39 AM</ReleaseDate><TotalComment>0</TotalComment><IsMedia>False</IsMedia><IsPicture>False</IsPicture><IsVote>True</IsVote><ArticlePassword /><PostVisible>0</PostVisible><ArticlePath>/2010/3/8/Tao-box-lay-thong-tin-thoi-tiet-VnExpress-336</ArticlePath><Approved>True</Approved><ImagePath /><CategoryId>30</CategoryId><ArrayCatID>30|25</ArrayCatID></Article></Articles>